<!DOCTYPE>

    <head>
    <link rel="stylesheet" type="text/css" href="design.css" media="screen"/>
    <title>Find Out What We Know</title>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="jquery.innerfade.js"></script>
    <script type="text/javascript"> 
	$(document).ready( function(){
		
		window.fbAsyncInit = function() {
          	FB.init({
            	appId      : 119360581508165,
            	status     : true, 
            	cookie     : true,
            	xfbml      : true,
				oauth	   : true
          	});	  
			
	  		FB.getLoginStatus(function(response) {
			  if (response.authResponse) {
				$("#infoLink").show();
			  } else {
				$("#infoLink").hide();
			  }
			});	    	
        };
		
		
        (function(d){
           var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
           js = d.createElement('script'); js.id = id; js.async = true;
           js.src = "//connect.facebook.net/en_US/all.js";
           d.getElementsByTagName('head')[0].appendChild(js);
         }(document));
	});
	
	

	function DoRedirect() {
		window.location.href = "info.php";	
	}
	
	function slideSwitch() {
    var $active = $('#slideshow IMG.active');

    if ( $active.length == 0 ) $active = $('#slideshow IMG:last');

    var $next =  $active.next().length ? $active.next()
        : $('#slideshow IMG:first');

    $active.addClass('last-active');

    $next.css({opacity: 0.0})
        .addClass('active')
        .animate({opacity: 1.0}, 1000, function() {
            $active.removeClass('active last-active');
        });
}

$(function() {
    setInterval( "slideSwitch()", 5000 );
});

	
	</script>
    </head>

    <body>
    	
    	<div id = "top-bar">
   			<img src="topbar2.png" alt="" class="top-bar"/>
   		</div>
    	
    	
    	<div id = "wrapper">
    		
    		<div id = "content">
    			
    			<div id = "logo">
					<img src="logo.png" alt="" class="logo"/>
				</div>
   		
				<div id = "side-bar-nav">
					<img src="sidenav.png" alt=""/>
					<a href="home.html"><img src="Banner1.png" alt="Why Your Privacy Matters" class="banner1"/></a>
					<img src="link2.png" alt="What is this site" class="link2"/>
					<img src="link3.png" alt="The Creators" class="link3"/>
					<img src="link4.png" alt="Privacy Policies" class="link4"/>
					<img src="link5.png" alt="Take our Survey" class="link5"/>
				</div>
		
				<div id="slideshow">
					<img src="slide1.png" alt="" class="active"/>
  					<img src="slide2.png" alt=""/>
  					<img src="slide3.png" alt=""/>
				</div> 
				<div id="facebook-bar">
					<img src="facebookbar.png" alt=""/>
				</div>
				<div id="fb-login-text">
					So you login to sites like Spotify, Vimeo or the Washington Post with Facebook, what's the big deal?
					Well, err... how should we put it, once we get one piece of data from your Facebook profile, it's kinda 
					easy to get the rest.  Maybe you should know what developers can access about you... Login below to find out. 
					If you're uneasy about using our site, feel free to take a peek at our privacy policy.  
				</div>
				<div id="fbloginbutton">
					<div id="fb-root">
					<fb:login-button show-faces="true" width="200" max-rows="1" perms="user_likes, friends_likes, offline_access, user_activities, friends_activities, user_birthday, friends_birthday, user_education_history, friends_education_history, user_groups, friends_groups, user_interests, friends_interests, friends_location, user_relationships, friends_relationships, user_relationship_details, friends_relationship_details, user_religion_politics, friends_religion_politics, email" next="http://www.hcs.harvard.edu/~cs105-wdwk/home.html"></fb:login-button>
					</div>
				</div>
				<div id="infoLink" style="display: none;">
					<a href="info.php"><img src="infolinkbutton.png" alt="Go to Info Page"/></a>
				</div>
					
				<div id="callout">
					<img src="callout.png" alt="" class="callout1"/>	
					<a href="mission.html"><img src="readmore.png" alt="Read More" class="readmore"/></a>
					<a href="mission.html"><img src="readmore.png" alt="Read More" class="readmore2"/></a>
					<a href="mission.html"><img src="takesurvey.png" alt="TakeSurvey" class="takesurvey"/></a>
				</div>
			
				
	
			</div>
			
		</div>
</body>
